﻿
@{
    ViewData["Title"] = "Index";
    Layout = "~/Views/Shared/_Layout.cshtml";
}

@section head{


    <link href="~/css/plugins/bootstrap-table/bootstrap-table.min.css" rel="stylesheet" />

    <style type="text/css">
        .dSearch .btn {
            margin-top: 10px;
        }

        .dSearch .form-control {
            display: inline-block;
        }

        .dSearch .layer-date {
            margin-top: -7px;
        }

        .dataTables_wrapper {
            padding-bottom: 0px;
        }

        div.dataTables_scrollBody table {
            margin-top: -18px !important;
        }

        .fixed-table-pagination .pagination-detail, .fixed-table-pagination div.pagination {
            margin-bottom: 0px;
        }
    </style>
}

    <form id="form1" >
        <div id="dMain">
            <div class="wrapper wrapper-content animated fadeInRight">
                <div class="ibox" style="margin-bottom: 0px;">
                    <div class="ibox-title">
                        <h5>系统日志</h5>
                    </div>
                    <div class="ibox-content">
                        <table id="tabData" class="table table-bordered table-fixed-header" style="width:100%;">
                            <thead class="header">
                                <tr>
                                    <th>#</th>
                                    <th>描述</th>
                                    <th>模块</th>
                                    <th>IP</th>
                                    <th>机构</th>
                                    <th>操作人</th>                                    
                                    <th>账号</th>
                                    <th>操作时间</th>
                                </tr>
                            </thead>
                        </table>
                    </div>
                </div>
            </div>
        </div>
       
        @*<div id="dJson" style="display: none;"><%=GetJsonData() %></div>*@
    </form>
    @section scripts{

        <script src="~/js/plugins/jeditable/jquery.jeditable.js"></script>
        <script src="~/js/plugins/bootstrap-table/bootstrap-table.min.js"></script>
        <script src="~/js/plugins/bootstrap-table/locale/bootstrap-table-zh-CN.min.js"></script>
        <script src="~/js/plugins/bootstrap-table/bootstrap-table-export.js"></script>
        <script src="~/js/plugins/bootstrap-table/tableExport.js"></script>
        <script src="~/js/plugins/bootstrap-table/bootstrap-table-cookie.js"></script>
        <script src="~/js/plugins/bootstrap-table/table-fixed-header.js"></script>
        <script src="~/js/My97DatePicker/WdatePicker.js"></script>
        <script src="~/js/verification.js"></script>
        <script type="text/javascript">
            $(function () {
                var tabHeight = document.documentElement.clientHeight - 100;
                $('#tabData').bootstrapTable({
                    height: tabHeight,
                    //data: $("#dJson").text() != "" ? JSON.parse($("#dJson").text()) : "",
                    url: "@Url.Action("GetSysLogForJson", "SysLog", new { area = "System" })",
                    dataType: "json",
                    columns: [
                        { align: 'center', width: "50px", checkbox: true },
                        { field: 'LogInfo', align: 'left' },
                        { field: 'Modular', align: 'center', width: "100px", sortable: true },
                        { field: 'Bak1', align: 'center', width: "100px", sortable: true },
                        { field: 'DM.DMName', align: 'center', width: "150px", sortable: true },
                        { field: 'User.UserName', align: 'center', width: "100px", sortable: true },
                        { field: 'User.UserAccount', align: 'center', width: "100px", sortable: true },
                        {
                            field: 'AddTime', align: 'center', width: "160px", sortable: true ,   formatter: function (value, row, index) {
                                return dateFormatter(value)
                            } }
                    ],
                    toolbar: '#toolbar',//工具按钮用哪个容器
                    buttonsClass: "sm btn-white",//按钮class
                    pageSize: 100,//分页条数
                    clickToSelect: true,//设置true将在点击行时，自动选择单选或复选框
                    singleSelect: true,//为true则禁止多选
                    cache: false,//是否缓存
                    cookie: true,//是否启用cookie
                    cookieIdTable: "Log",//cookie键值
                    pagination: true,//是否分页
                    showColumns: true,//是否显示所有的列
                    showRefresh: true,//是否显示刷新按钮
                    search: true,//是否启用搜索
                    showPaginationSwitch: true,//是否显示分页切换按钮
                    showExport: true,//是否启用导出
                    striped: false,//是否显示行间隔色
                    onSearch: function (text) {
                        if (text != "") {
                            $("#tabData tbody tr td:not(.bs-checkbox)").each(function (i) {
                                var str = "<span class=\"bg-yellow\">" + text + "</span>";
                                var NewText = $("#tabData tbody tr td:not(.bs-checkbox)").eq(i).text().replaceAll(text, str);
                                $("#tabData tbody tr td:not(.bs-checkbox)").eq(i).html(NewText);
                            })
                        }
                    }
                });
                //转换日期格式(时间戳转换为datetime格式)
                function dateFormatter(value) {
                    if (value == '' || value == undefined) {
                        return value;
                    }
                    var myDate = new Date(value);
                    //获取当前年
                    var year = myDate.getFullYear();
                    //获取当前月
                    var month = myDate.getMonth() + 1;
                    month = month < 10 ? "0" + month : month;
                    //获取当前日
                    var date = myDate.getDate();
                    date = date < 10 ? "0" + date : date;
                    var h = myDate.getHours();       //获取当前小时数(0-23)
                    h = h < 10 ? "0" + h : h;
                    var m = myDate.getMinutes();     //获取当前分钟数(0-59)
                    m = m < 10 ? "0" + m : m;
                    var s = myDate.getSeconds();
                    s = s < 10 ? "0" + s : s;
                    var time = year + '-' + month + "-" + date + " " + h + ":" + m + ":" + s;
                    return time;
                }
            })
        </script>
    }
